<html>
<head>
<title>Cellular Automata</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="lang.js"></script> 
<script type="text/javascript" src="neighborhood.js"></script> 
<script type="text/javascript" src="universe.js"></script> 
<script type="text/javascript" src="rule.js"></script> 
<script type="text/javascript" src="cacanvas.js"></script> 
<script type="text/javascript" src="jquery.js"></script> 
<style>

body {margin:0;padding:0}

#ca {
	top: 0;
	left: 0;
	position: fixed;
	cursor: pointer;
	z-index:1;
}

.copy {
	top: 0;
	left: 0;
	font-family: monospace;
	font-weight: bolder;
	position: fixed;
	color: #888;
	opacity: .5;
	z-index:10;
	font-size: 18px;
	margin: 4px 0px 0px 4px;
	text-decoration: none;
}

#size {
	top: 0;
	left: 0;
	position: fixed;
	z-index:2;
}

</style>
<script>

var Rule = akinao.ca.Rule;
var CA = akinao.ca.CellAutomata;
var Color = akinao.ca.Color;

var rules = [];
(function() {
	var r = {
		"C": {0:{1:"x0305500713151638700f171d33353a"},1:{1:"t123"}},
		"S1": {0:{1:"t2"},1:{2:"d",1:"t34.x0305"},2:3},
		"S2": {0:{1:"t2.x0715161c"},1:{2:"d",1:"t34.x0305"},2:3},
		"Brain": {0:{1:"t2.x31"},1:2,3:{3:"t1"}},
		"B": {0:{1:"t2",3:"t3",f:[1,3]},1:2,3:{3:"t145",1:"t23",f:[1,3]}},
		"Star Wars": {0:{1:"t2"},1:{2:"d",1:"t345"},2:3,3:0,5:2},
		"Life": {0:{1:"t3"},1:{1:"t23"}},
		//"Star Wars": {0:{1:"x112f"},1:{2:"d", 1:"x3003054e38f132653130453e"},2:3,3:0},
		"A": {0:{1:"x013a1538",2:"xf5f7"},1:{1:"t12"},2:3,3:4},
	};
	for (var n in r) {
		rules[n] = Rule.create(n, r[n]);
	}
})();

var rule = rules["A"];
var color = Color.palette.gradation;
var random = {0:6,1:1};

var ca = null;

function next() {
	ca.next();
	setTimeout(next, 10);
}

$(window).resize(function() {
	resize();
});

$(window).load(function () {
	var params = getQueryParams();
	if (params) {
		if (params.r && rules[params.r]) {
			rule = rules[params.r];
		}
		if (params.c && Color.palette[params.c]) {
			color = Color.palette[params.c];
		}
		if (params.i) {
			random = params.i;
		}
	}
	resize();
	next();
	$('#ca').click(function() {
		resize();
		});
	});


var MAX = 120;
function resize() {
	var c = $('#ca');
	var w = $(window).width();
	var h = $(window).height();
	c.width(w).height(h);
	var u = universeSize(w, h);
	ca = new CA({
		element: document.getElementById("ca"),
		universe: {x: u.x, y: u.y, closed: true},
		rule: rule, 
		color: color,
		pix: u.pix,
	});
	ca.next(Rule.random(random));
}

function universeSize(w, h) {
	var s = w > h ? w : h;
	var p = div(s, MAX);
	var x = div(w, p);
	var y = div(h, p);
	return {pix:p, x:x, y:y};
}

function div(n, d) {
	var r = parseInt(n / d);
	if (0 < n % d) r++;
	return r;
}

function getQueryParams() {
	var qs = location.search;
	if (qs) {
		var qsa=qs.substring(1).split('&');
 		var params={};
		for (var i = 0; i < qsa.length; i++) {
			var pair=qsa[i].split('=');
			if (pair[0]) {
				params[pair[0]]=decodeURIComponent(pair[1]);
			}
		}
		return params;
	}
	return null;
}
</script>
</head>
<body>
<a class="copy" href="http://www.akinao.com">akinao.com</a>
<canvas id="ca"></canvas>
</body>
</html>
